import { VantComponent } from '../../dist/common/component';

VantComponent({
  field: true,
  classes: ['input-class', 'plus-class', 'minus-class'],
  props: {
    value: {
      type: null,
      observer(value) {
        // 如果value是空字符串，直接设置currentValue为空字符串
        if (value === '') {
          this.setData({ currentValue: '' });
        } else if (String(value) !== String(this.data.currentValue)) {
          this.setData({ currentValue: this.format(value) });
        }
      },
    },
    integer: Boolean,
    disabled: Boolean,
    inputWidth: null,
    buttonSize: null,
    asyncChange: Boolean,
    disableInput: Boolean,
    decimalLength: {
      type: Number,
      value: null,
    },
    min: {
      type: null,
      value: 1,
    },
    max: {
      type: null,
      value: Number.MAX_SAFE_INTEGER,
    },
    step: {
      type: null,
      value: 1,
    },
    showPlus: {
      type: Boolean,
      value: true,
    },
    showMinus: {
      type: Boolean,
      value: true,
    },
    disablePlus: Boolean,
    disableMinus: Boolean,
    longPress: {
      type: Boolean,
      value: true,
    },
  },
  data: {
    currentValue: '',
  },
  created() {
    this.setData({
      currentValue: this.data.value === '' ? '' : this.format(this.data.value),
    });
  },
  methods: {
    filter(value) {
      value = String(value).replace(/[^0-9.-]/g, '');
      if (this.data.integer && value.indexOf('.') !== -1) {
        value = value.split('.')[0];
      }
      return value;
    },
    format(value) {
      // 如果是空字符串，直接返回空字符串
      if (value === '') {
        return '';
      }
      
      value = this.filter(value);
      // 转换为数字
      value = +value;
      // 限制范围
      value = Math.max(Math.min(this.data.max, value), this.data.min);
      // 格式化小数
      if (this.data.decimalLength !== null) {
        value = value.toFixed(this.data.decimalLength);
      }
      return value;
    },
    onInput(event) {
      const { value = '' } = event.detail || {};
      // 允许输入为空
      if (value === '') {
        this.emitChange('');
        return;
      }
      let formatted = this.filter(value);
      // 限制小数长度
      if (this.data.decimalLength !== null && formatted.indexOf('.') !== -1) {
        const pair = formatted.split('.');
        formatted = `${pair[0]}.${pair[1].slice(0, this.data.decimalLength)}`;
      }
      this.emitChange(formatted);
    },
    emitChange(value) {
      if (!this.data.asyncChange) {
        this.setData({ currentValue: value });
      }
      this.$emit('change', value);
    },
    onChange(type) {
      if (this.isDisabled(type)) {
        this.$emit('overlimit', type);
        return;
      }
      
      const diff = type === 'minus' ? -this.data.step : +this.data.step;
      const value = this.data.currentValue === '' ? 0 : +this.data.currentValue;
      const result = this.format(value + diff);
      this.emitChange(result);
      this.$emit(type);
    },
    onTap(event) {
      const { type } = event.currentTarget.dataset;
      this.onChange(type);
    },
    onFocus(event) {
      this.$emit('focus', event.detail);
    },
    onBlur(event) {
      const value = this.format(event.detail.value);
      this.emitChange(value);
      this.$emit('blur', { ...event.detail, value });
    },
    isDisabled(type) {
      const { disabled, currentValue, disablePlus, disableMinus, max, min } = this.data;
      
      if (type === 'plus') {
        return disabled || disablePlus || (currentValue !== '' && +currentValue >= max);
      }
      
      return disabled || disableMinus || (currentValue !== '' && +currentValue <= min);
    },
    onTouchStart(event) {
      if (!this.data.longPress) {
        return;
      }
      clearTimeout(this.timer);
      const { type } = event.currentTarget.dataset;
      this.timer = setTimeout(() => {
        this.onChange(type);
        this.interval = setInterval(() => {
          this.onChange(type);
        }, 200);
      }, 600);
    },
    onTouchEnd() {
      if (!this.data.longPress) {
        return;
      }
      clearTimeout(this.timer);
      clearInterval(this.interval);
    },
  },
});